/* 
 @description: 图片管理

 @author: 韦淇霰

 @update: 2021年9月11日18:55:35
 */
 const add= document.getElementById('add'),
 input =document.querySelector('input'),
 back = document.querySelector('.back'),
 submit = document.getElementById('submit'),
 closes = document.getElementById('closes'),
 search = document.querySelector('.Search'),
 pir = document.getElementById('pir'),
 ms = document.getElementById('miao'),
 nums = document.getElementById('num'),
 times = document.getElementById('time_'),
 table = document.getElementById('tab');
 let isEdit = 0;    
 getList();
     function getList(keyname='',data) {
        $.ajax({
        url: `http://127.0.0.1:7001/api/rotationChart?keyname=${keyname}`,
        method: "get",
        dada:data,
        success: function(res) {
            console.log(res);
                for (var i = 0; i < res.data.length; i++) {
                    const tr = document.createElement('tr');
                    for (let data in res.data[i]) {
                    const td = document.createElement("td");
                        td.innerHTML = res.data[i][data]
                        tr.appendChild(td); 
                        if(data === 'upload_time'){
                            let upload_time = res.data[i].upload_time;
                            var times = new Date(parseInt(upload_time)).toLocaleString();
                           
                            td.innerHTML=times;
                        }
                        if(data === 'action_on'){
                            console.log(res.data[i][data])
                            td.innerHTML=`<img src='http://127.0.0.1:7001/${res.data[i][data]}' >`;   
                        }
                    } 
                    const lasttd = document.createElement('td');
                    lasttd.innerHTML  = `<button type='button'  name="updata" class="up" id='${res.data[i].id}'><i class="fa fa-wrench" aria-hidden="true"></i> 修改</button>`
                    tr.appendChild(lasttd)
                    tr.id = res.data[i].id;
                    table.appendChild(tr);
                }
            }  
        }
    )}

    //上传照片
     console.log(pir);
     pir.addEventListener('change',function(){
        const up = document.getElementById('up');
        console.log(up);
        const formData = new FormData(up);
        var ll=formData.get('pir')
        picture(ll)
     })
     
    function picture(ll){
        const img_file = document.getElementById('pir');
        const formData = new FormData();
        const fileObj = img_file.files[0];
        formData.append("classIcon",fileObj);
        console.log(formData);
        $.ajax({
            url:`http://127.0.0.1:7001/api/picture`,
            type :'post',
            data : formData,
            async :false,
            cache: false,
            processData :false,
            contentType : false,
            success : function(data){
                if(data.code === 0){
                    console.log(data)
                    this.text = data.data;
                    localStorage.setItem('data',data.data);
                }
               
            }
              
        })
       
    }
    //传轮播图路径
    function picture_a(){
       const data = localStorage.getItem('data');
       console.log(data);
        $.ajax({
            url:`http://127.0.0.1:7001/api/rotationChart`,
            method:"post",
            data:data,
            success:function(res){
                if(res.code === 0){
                    console.log(data);
                }else{
                    alert(res.msg);
                }
            }
        })
    }
     // 选择的图片预览在页面上
     const imgCon = document.getElementById('imgCon');
     const img = document.getElementById('img');
    //  imgCon.style.display = 'none';
     let imgUrl = '';
     pir.onchange = function (e) {
         const fileList = e.target.files;
         console.log(fileList);
         if (fileList.length) {
             imgCon.style.display = 'block';
             imgUrl = window.URL.createObjectURL(fileList[0]);
             console.log(imgUrl);
             img.src = imgUrl;
         }
     }
 //编辑
 function EditCa(action_on, describe_ ,num ,upload_time ,id){
    const data = localStorage.getItem('data');

     $.ajax({
     url:`http://127.0.0.1:7001/api/rotationChart/${id}`,
     method:"put",
     data:{
        action_on ,
        describe_ ,
        num,
        upload_time ,
        id
     },
     success:function(res){
        //  console.log(res);
         if(res.code === 0){
         window.location.reload();
        //  closeBack();  
         }else{
             alert(res.msg);
         }
     }
 })
 }
 //获取详情
 function getInfo(id){
     $.ajax({
     url:`http://127.0.0.1:7001/api/rotationChart/${id}`,
     method:"get",
     data:{
         id,
     },
     success:function(res){
        //  console.log(res);
         if(res.code === 0){
        console.log(res);
        pir.src = res.data.action_on;
         ms.value = res.data.describe_;
         nums.value = res.data.num;
        img.src = `http://127.0.0.1:7001/${res.data.action_on}`;
         }else{
             alert(res.msg)
         }
         console.log(res);
     }
     
     })
 }
 let ida=0;
 //通过事件委托操作编辑
 table.onclick = function(e){
    if(e.target.className === 'up'){
         back.style.display = 'block';
         const id  = e.target.id;
            ida = id
         getInfo(id);
     }
 }
    
 //编辑提交按钮
 submit.onclick = function(){
    // console.log(ida);
    const data = localStorage.getItem('data');
    console.log(data,ms.value,nums.value,times.value,ida);
    EditCa(data,ms.value,nums.value,times.value,ida);
    picture();
    picture_a();
    getList();
 }
 closes.onclick = function(){
    pir.value = '';
    ms.value ='';
    
    times.value ='';
    back.style.display = 'none';
 }


 